<template>
    <div>
   <div class="content" v-for="s in signupInfo" :key="s.vno">
				<div class="a1">
											
				</div>									
				<div class="a2">
					<h2>{{s.vname}}</h2>
					<div class="a21">
						
                            <p></p>
							<span class="color">志愿活动时间：</span>
                            <p></p>
							<span class="neir">{{s.activitytime}}</span>																
							<p></p>
							<span class="color">活动地点：</span>
                            <p></p>
							<span class="neir">{{s.vspot}}</span>
							<p></p>
							<span class="color">报名开始时间：</span>
                            <p></p>
							<span class="neir">{{s.starttime}}</span>
                            <p></p>
							<span class="color">报名截止时间：</span>
                            <p></p>
							<span class="neir">{{s.deadline}}</span>						
							<p></p>
							<span class="color">招募人数：</span>
                            <p></p>
							<span class="neir">{{s.headcount}}</span>
                            <p></p>
							<span class="color">实践时长</span>
							<p></p>
                            <span class="neir">{{s.activitytime}}</span>
                            <p></p>
							<span class="color">活动报酬：</span>
							<p></p>
                            <span class="neir">{{s.reward}}</span>
                            <p></p>
							<span class="color">工作内容：</span>
							<p></p>
                            <span class="neir">{{s.task}}</span>
						</div>
					
						
					
				</div>
			</div>
        </div>
</template>
<script>
 export default {
       props:['vno'],
       data(){
        return {
          signupInfo:{}
        }
       },
       created(){
        this.getSignupInfo()
       },
       methods:{
              getSignupInfo(){
                this.axios({
                url:'/api/volunteering/detail',
                method:"get",
                params:{
                    vno:this.vno
            }
        })
          .then(res=>{
                if(res.data.code==0){
                    this.signupInfo=res.data.data
                }else{
                    alert(res.data.msg)
                }
            })
            console.log(this.vno)
       
              }

       }
       }
</script>
<style lang="scss" scoped>

.content{
/* 	border: 1px solid red; */
	width: 1200px;
	margin-top: -80px;
	margin: auto;
}
.content .a1{
	float: left;
	margin-left: 10px;
}
.content .a1 .big{
	/* float: left; */
	width: 150px;
	height: 180px;
}

.content.a2{
	display:inline-block;
	position:relative;
    background-color: #F2F5F8;
}
.content.a21 .color{
	color: #758188;
    font:40pt;
}

.content.a21{
	background-color: #F6F9FB;
}
.content.a21 span,p{
	display:block;
}
.content.a21 .neir{
	display:block;
    font:40pt;
    color: #000000;
}


.content.a25{
	margin-top: 30px;
}
.content.a25 button{
	display: inline-block;
	width: 100px;
	height: 60px;
	border-radius: 30px;
	margin-left: 30px;
}
.content.a25 .a25color2{
	background-color: #FFEEE8;
	color: #0d9eff;
	font-size: 20px;
	font-weight: bolder;
	border: 1px #0dcfff solid;
}


</style>